<template>
  <div class="span">
    <data-grid :model="model" partial='list' v-ref:grid>
      <template partial='head'>
        <tr>
          <th>气价编号</th>
          <th>气价类型</th>
          <th>气价名称</th>
          <th>截止日期</th>
          <th>状态</th>
        </tr>
      </template>
      <template partial='body'>
       <tr>
         <td style="text-align:center">{{row.f_price_id}}</td>
         <td style="text-align:center">{{row.f_price_type}}</td>
         <td style="text-align:center">{{row.f_price_name}}</td>
         <td style="text-align:center" v-if="row.f_state === '无效'">{{row.f_end_date}}</td>
         <td style="text-align:center" v-if="row.f_state === '有效'"></td>
         <td style="text-align:center">{{row.f_state}}</td>
       </tr>
     </template>
     <template partial='foot'></template>
   </data-grid>
  </div>
</template>

<script>
/**
*阶梯气价相关信息组件
*/

export default {
  props: ['data'],
  data () {
    return {
      model: {
        rows: []
      }
    }
  },
  watch: {
    'data' (val) {
      this.f_price_id = val.f_price_id
      this.getUpdate()
    }
  },
  ready () {
    this.f_price_id = this.data.f_price_id
    this.getUpdate()
  },
  methods: {
    getUpdate () {
      let tablename = 't_stairprice'
      let condition = 'f_price_id=' + "'" + this.f_price_id + "'"
      this.$SqlService.singleTable(tablename, condition)
      .then(
        (res) => {
          this.model.rows = res.data
        }
      ).catch(
        (error) => this.$dispatch('error', '气价修改记录', this.data, error)
      )
    }
  }
}
</script>
<style>

</style>
